<template>
	<view class="upload-box">
		<view class="title">上传图片</view>
		<view class="upload-image">
			<view class="upload" v-if="!isJustShow" @click="chooseImage">
				<image :src="$getImageSrc('camera.png')" mode=""></image>
			</view>
			<image class="showImage" :src='imageUrl' mode="heightFix"></image>
		</view>
	</view>
</template>

<script>
	export default {
		name:"upload-image",
		props:{
			isJustShow:{
				type:Boolean,
				default:false
			},
			tip:{
				type:String,
				default:'正面'
			},
			imageSrc:{
				type:String,
				default:''
			}
		},
		data() {
			return {
				// currImageSrc:this.imageSrc
				imageUrl:''
			};
		},
		methods:{
			chooseImage(){
				// this.$uploadFile().then((res) => {
				// 	this.$emit('update:imageSrc', `data:image/jpeg;base64,${res}`)
				// 	console.log(res)
				// 	// this.currImageSrc = res
				// })
				uni.chooseImage({
					count: 1,
					mediaType: ['image'],
					sourceType: ['album', 'camera'],
					camera: 'back',
					
					success:(files) => {
						uni.showLoading({
							title:'上传中……',
							mask: true
						})
						this.$emit('update:imageSrc', files.tempFilePaths[0])
						uni.getFileSystemManager().readFile({
							encoding:'base64',
							filePath:files.tempFilePaths[0],
							success:(baseRes)=>{
								this.imageUrl = `data:image/jpeg;base64,${baseRes.data}`
							},
							complete:() => {
								uni.hideLoading()
							}
						})
						
					},
					fail:(err) => {
					}
					})
					}
		}
	}
</script>

<style lang="scss">
.upload-box{
	width: 90%;
	margin: 0 auto 20rpx;
	overflow: hidden;
	border-bottom: 1px solid #f8f8f8;
	.title{
		line-height: 100rpx;
	}
	.upload-image{
		display: flex;
		justify-content: flex-start;
		align-items: center;
		margin-bottom: 20rpx;
		.upload{
			width: 200rpx;
			height: 200rpx;
			background-color: #eee;
			display: flex;
			justify-content: center;
			align-items: center;
			margin-right: 40rpx;
			image{
				width:64rpx;
				height: 64rpx;
			}
		}
	}
	.showImage{
		height: 200rpx;
		max-width:calc(100% - 240rpx)
	}
}
</style>